<template>
    <div class="bank-product-container">
        <div class="bank-product-text">请填写产品详情:</div>
        <el-form :model="update_form_param" :rules="update_form_rules" ref="update_form" class="ms-content">
            <table style="border-collapse: collapse; margin-bottom: 45px; margin-top: 20px" border="1" cellpadding="0" cellspacing="0">
                <tr>
                    <td style="width: 550px; padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="id" label="产品编号">
                            <el-input
                                :disabled="true"
                                maxlength="10"
                                placeholder="自动生成"
                                :style="{'maxWidth': '450px'}">
                            </el-input>
                        </el-form-item>
                    </td>
                    <td style="width: 550px; padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="title" label="产品标题">
                            <el-input
                                :disabled="disableForm"
                                maxlength="10"
                                v-model="update_form_param.title"
                                :style="{'maxWidth': '450px'}">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="width: 550px; padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="form" label="融资形式">
                            <el-select :style="{'width': '450px'}" v-model="update_form_param.form">
                                <el-option v-for="(item, index) in form_access"  :label="item" :value="item"/>
                            </el-select>
                        </el-form-item>
                    </td>
                    <td style="width: 550px; padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="business" label="行业类别">
                            <el-select :style="{'width': '450px'}" v-model="update_form_param.business">
                                <el-option v-for="(item, index) in business_access"  :label="item" :value="item"/>
                            </el-select>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="width: 550px; padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="pool" label="信息池号">
                            <el-select :style="{'width': '450px'}" v-model="update_form_param.pool">
                                <el-option v-for="(item, index) in pool_access"  :label="item" :value="item"/>
                            </el-select>
                        </el-form-item>
                    </td>
                    <td style="width: 550px; padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="keyword" label="关键词语">
                            <el-input
                                :disabled="disableForm"
                                maxlength="10"
                                v-model="update_form_param.keyword"
                                :style="{'maxWidth': '450px'}">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="maxCap" label="贷款额度">
                            <el-input
                                :disabled="disableForm"
                                maxlength="10"
                                v-model="update_form_param.maxCap"
                                :style="{'maxWidth': '450px'}">
                            </el-input>
                        </el-form-item>
                    </td>
                    <td style="padding: 10px">
                        <el-form-item style="margin-bottom: 0" prop="maxCap" label="贷款期限">
                            <el-input
                                :disabled="disableForm"
                                maxlength="10"
                                v-model="update_form_param.period"
                                :style="{'maxWidth': '450px'}">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="padding: 10px" colspan="2">
                        <el-form-item style="margin-bottom: 0" prop="targetCap" label="贷款利率">
                            <el-input
                                :disabled="disableForm"
                                maxlength="10"
                                v-model="update_form_param.rate"
                                :style="{'maxWidth': '450px'}">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="padding: 10px" colspan="2">
                        <el-form-item style="margin-bottom: 0" prop="desc" label="产品简介">
                            <el-input
                                :disabled="disableForm"
                                maxlength="255"
                                type="textarea"
                                :autosize="{ minRows: 4, maxRows: 4}"
                                placeholder="项目详情"
                                v-model="update_form_param.desc">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="padding: 10px" colspan="2">
                        <el-form-item style="margin-bottom: 0" prop="process" label="放贷流程">
                            <el-input
                                :disabled="disableForm"
                                maxlength="255"
                                type="textarea"
                                :autosize="{ minRows: 4, maxRows: 4}"
                                placeholder="项目详情"
                                v-model="update_form_param.process">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="padding: 10px" colspan="2">
                        <el-form-item style="margin-bottom: 0" prop="qualification" label="申请条件">
                            <el-input
                                :disabled="disableForm"
                                maxlength="255"
                                type="textarea"
                                :autosize="{ minRows: 4, maxRows: 4}"
                                placeholder="项目详情"
                                v-model="update_form_param.qualification">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td style="padding: 10px" colspan="2">
                        <el-form-item style="margin-bottom: 0" prop="note" label="产品备注">
                            <el-input
                                :disabled="disableForm"
                                maxlength="255"
                                type="textarea"
                                :autosize="{ minRows: 4, maxRows: 4}"
                                placeholder="项目详情"
                                v-model="update_form_param.note">
                            </el-input>
                        </el-form-item>
                    </td>
                </tr>
            </table>
        </el-form>
        <el-button type="success" @click="handlePub">
            确认发布
        </el-button>
    </div>
</template>

<script>

    import {pubEnterpriseProduct} from "../../api/enterprise-product";
    import {getMyEnterprise} from "../../api/enterprise";
    import {getMyBank} from "../../api/bank";
    import {pubBankProduct} from "../../api/bank-product";

    export default {
        name: 'pub-bank-product',
        data() {
            return {
                update_form_param: {
                    form: '',
                    business: '',
                    pool: '',
                    title: '',
                    keyword: '',
                    maxCap: 0,
                    period: 0,
                    rate: 0,
                    desc: '',
                    qualification: '',
                    process: '',
                    note: '',
                },
                form_access: [],
                business_access: [],
                pool_access: [],
                update_form_rules: {
                    // pid: [{ required: true, message: '请输入患者身份证号', trigger: 'blur' }],
                    // form: [{ required: true, message: '请输入患者姓名', trigger: 'blur' }],
                    // business: [{ required: true, message: '请输入患者年龄', trigger: 'blur' }],
                    // pool: [{ required: true, message: '请输入患者性别', trigger: 'blur' }],
                    // desc: [{ required: true, trigger: 'blur' }],
                    // caseDescription: [{ required: true, message: '卿输入诊断结果', trigger: 'blur' }],
                    // solutionDescription: [{ required: true, message: '请输入治疗方案', trigger: 'blur' }],
                },
                disableForm: false,
            }
        },
        methods: {
            handlePub() {
                pubBankProduct(this.update_form_param).then(res => {
                    console.log(res.data)
                })
                window.location.reload()
            },
            setAccess(form_access, business_access, pool_access) {
                form_access = JSON.parse(form_access)
                business_access = JSON.parse(business_access)
                pool_access = JSON.parse(pool_access)
                if(!form_access) {
                    form_access = []
                }
                if(!business_access) {
                    business_access = []
                }
                if(!pool_access) {
                    pool_access = []
                }
                this.form_access = form_access
                this.business_access = business_access
                this.pool_access = pool_access
            }
        },
        mounted() {
            // pubEnterpriseProduct().then(res => {
            //     console.log(res)
            // })
            getMyBank().then(res => {
                let data = res.data
                this.setAccess(data.formAccess, data.businessAccess, data.poolAccess)
                console.log(this.form_access)
            })
        }
    }
</script>

<style lang="scss" scoped>
    .bank-product {
        &-container {
            margin: 30px;
        }

        &-text {
            font-size: 36px;
            line-height: 46px;
            font-weight: 600;
        }
    }
</style>
